<!--头部公共部分-->
{include file="common/header" /}

<div class="x-nav">
      <span class="layui-breadcrumb">
        <a>首页</a>
        <a>财务</a>
        <a>
          <cite>退费记录</cite></a>
      </span>
    <a class="layui-btn layui-btn-xs layui-btn-small" style="float:right;margin-top: 10px;"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon layui-icon-refresh"></i> </a>
</div>
<div id="wodekehu" class="x-body" class="clear:both;">
    <div class="layui-row"
         style="padding-left:20px;border-left:1px solid #e5e5e5;border-right:1px solid #e5e5e5;">
        <div class="layui-form layui-col-md12 x-so layui-form-pane"  lay-filter="form-organization">
            <div class="layui-input-inline">
                <select name="campus_id" lay-verify="required" lay-search="">
                    <option value="">选择校区</option>
                    {volist name="campus_name" id="campu"}
                    <option value="{$campu.id}">{$campu.campus_name}</option>
                    {/volist}
                </select>
            </div>
            <div class="layui-input-inline">
                <input type="text" name="student_name" placeholder="请输入学生姓名" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline">
                <input type="text" name="receipt_number" placeholder="退款凭证" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline">
                <select name="refund_channel" lay-verify="required" lay-search="">
                    <option value="">选择退款通道</option>
                    {foreach name="data[20]" id="vo"}
                    <option value="{$vo.id}">{$vo.name}</option>
                    {/foreach}
                </select>
            </div>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" style="width: auto" placeholder="选择退款日期" name="refund_date" id="start">
            </div>
            <div class="layui-input-inline">
                <button class="layui-btn" id="search">
                    <i class="layui-icon layui-icon-search"></i>筛选</button>
                <button class="layui-btn layui-btn-danger" id="clear">
                    <i class="layui-icon"></i>重置</button>
            </div>
        </div>
    </div>
    <table class="layui-hide" id="LAY_table_user" lay-filter="Event"></table>
    <script type="text/html" id="barTable">
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
    </script>
</div>
<!--底部公共部分-->
{include file="common/footer" /}

<script>
    layui.use(['form', 'table', 'element', 'laydate', 'layer', 'laytpl'], function () {
        var $ = layui.$,
            form = layui.form,
            table = layui.table,
            element = layui.element,
            laydate = layui.laydate,
            layer = layui.layer;

        var loading = layer.load();


        //数据表格 方法级渲染
        var tableIns = table.render({
            elem: '#LAY_table_user'
            , url: '{:url("finance/refundlist")}'
            , method: 'POST'
            , loading: true
            , parseData: function (res) { //res 即为原始返回的数据
                if (res.code === 1) {
                    res.code = 0;
                } else {
                    res.code = -1;
                }
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.message, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.data //解析数据列表
                };
            },
            cols: [[
                {field: 'receipt_number', title: '退款凭证', style:'color:#01AAED;font-weight: bold;', width: 200, sort: true, fixed: false, align: 'center'
                }, {field: 'contract_number', title: '订单编号', width: 200, sort: true, fixed: false, align: 'center'
                }, {field: 'campus_name', title: '退款校区', width: 120, align: 'center'
                }, {field: 'student_name', title: '学员姓名', width: 100, align: 'center'
                }, {field: 'total_amount', title: '订单总额(元)', width: 120, align: 'center'
                }, {field: 'amount', title: '已收金额(元)', width: 120, align: 'center'
                }, {field: 'balance', title: '账户余额(元)', width: 120, align: 'center'
                }, {field: 'experienced_person', title: '经手人', width: 100, align: 'center'
                }, {field: 'refund_channel_text', title: '退款通道', width: 100, align: 'center'
                }, {field: 'refund_amount', title: '退款金额(元)', style:'color:#FF5722;font-weight: bold;', width: 120, align: 'center'
                }, {field: 'update_time', title: '退款时间', width: 200, align: 'center',edit: 'text'
                }, {fixed: 'right', title: '操作', width: 100, align: 'center', toolbar: '#barTable'}
            ]]
            , height: 'full-180'
            , page: true
            , done: function () {
                layer.close(loading);
            }
        });

        //日期
        laydate.render({
            elem: '#start',
            range:true
            ,trigger: 'click'
        });

        //监听工具条
        table.on('tool(Event)', function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            if(layEvent === 'del'){
                layer.confirm('真的撤销该退费记录吗?', function (index) {
                    $.post("{:url('finance/del')}", {
                        id: data.id
                    }, function (result) {
                        if (result.code === 1) {
                            layer.msg(result.msg, {
                                time: 2000
                            });
                            tableIns.reload();

                        } else {
                            layer.msg(result.msg, {
                                icon: 2,
                                time: 2000
                            });
                        }
                    }, "json")
                });
            }
        });

        //搜索项
        $('#search').click(function () {
            var field = {};
            field.student_name = $('input[name=student_name]').val();
            field.campus_id = $('select[name=campus_id]').val();
            field.refund_channel = $('select[name=refund_channel]').val();
            field.receipt_number = $('input[name=receipt_number]').val();
            var create_date_rang = $('input[name=refund_date]').val();
            if(create_date_rang.length > 0){
                strs_date=create_date_rang.split("-"); //字符分割
                field.start_date = strs_date[0]+'-'+strs_date[1]+'-'+strs_date[2];
                field.end_date = strs_date[3]+'-'+strs_date[4]+'-'+strs_date[5];
            }
            console.log(field);
            tableIns.reload({
                where: field,
                method: 'POST',
                page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });//清除
        $('#clear').click(function () {
            $('.layui-form-pane').find('.layui-input-inline').each(function (index, element) {
                $(element).find('input[type=text]').val('');
                $(element).find('select').val('');
            })
            tableIns.reload({
                where: {
                    'student_name': '',
                    'receipt_number': '',
                    'refund_channel': '',
                    'refund_date': '',
                },
                page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });

    });
</script>